import React, { Component } from "react";
import { Button, Modal, Input, Radio, Select, Switch, TreeSelect, message } from "antd";
import { knowledgeAllFileCategoryTree } from "@/services/knowledgemanagement";
import { knowledgeImportFile } from "@/services/knowledgeFile";
const { TreeNode } = TreeSelect;

class ReferenceTemplate extends Component {
	constructor(props) {
		super(props);
		this.state = {
			initData: null,
			visible: false,
			categoryFileList: [],
			categoryFileValue: '',
			loading: false,
		};
	}

	componentDidMount() {
		if (this.props.onRef) {
			this.props.onRef(this)
		}
	}

	init = initData => {
		this.setState({ visible: true, initData }, () => this.getTreeList());
	}

	getTreeList = async () => {
		const { initData } = this.state;
		let res = await knowledgeAllFileCategoryTree();
		console.log(res);
		this.setState({
			categoryFileList: res,
			categoryFileValue: initData && initData.type !== 'classify' ? res && res.length > 0 && res[0].children && res[0].children.length > 0 ? res[0].children[0].id : '' : res && res.length > 0 ? res[0].id : ''
		})
	}

	onCreate = () => {
		const { categoryFileValue, initData } = this.state;
		if (categoryFileValue === '') return;
		this.setState({ loading: true }, async () => {
			let obj = null;
			let res = { data: false, msg: '操作失败' };
			if (initData && initData.type !== 'classify') {
				obj = {
					templateDocIds: initData.id,
					targetDocCategoryId: categoryFileValue,
				};
				res = await knowledgeImportFile(obj);
			} else {
				obj = {
					templateDocCategoryId: initData.id,
					targetDocCategoryId: categoryFileValue,
				};
				res = await knowledgeImportFile(obj);
			};

			if (res?.data) {
				this.setState({ loading: false }, () => {
					this.onCancel();
					message.success('操作成功');
				})
			}
		})
	}
	onCancel = () => {
		this.setState({
			initData: null,
			visible: false,
			categoryFileList: [],
			categoryFileValue: '',
		});
	}

	onFileChangeCategory = (value) => {
		// console.log(value);
		this.setState({ categoryFileValue: value });
	};

	renderTreeFile = (data) => {
		return data.map((item) => {
			if (item.children) {
				return (
					<TreeNode title={item.name} key={item.id} value={item.id} id={item.id}>
						{this.renderTreeFile(item.children)}
					</TreeNode>
				);
			};
			return (
				<TreeNode title={item.name} key={item.id} value={item.id} id={item.id} />
			);
		});
	};

	render() {
		const { initData, visible, categoryFileList, loading } = this.state;
		const formItemLayout = {
			labelCol: {
				xs: { span: 24 },
				sm: { span: 6 },
			},
			wrapperCol: {
				xs: { span: 24 },
				sm: { span: 16 },
			},
		};

		return (
			<Modal
				visible={visible}
				title='引用文档知识点'
				okText='确认'
				cancelText='取消'
				onCancel={this.onCancel}
				// onOk={this.onCreate}
				destroyOnClose
				footer={[
					<Button onClick={this.onCancel}>取消</Button>,
					<Button type="primary" loading={loading} onClick={this.onCreate}>确定</Button>
				]}
				width={720}
			>
				{initData?.type === 'classify' ? (
					<div style={{ marginBottom: 16 }}>引用分类后，该分类下的所有知识点将导入到下方选择的文档知识点分类下。</div>
				) : (
					<div style={{ marginBottom: 16 }}>已选择的知识点将导入到下方选择的文档知识点分类下。</div>
				)}
				<div>
					<div style={{ display: 'flex', alignItems: 'center', paddingLeft: 30 }}>
						<label style={{ marginRight: 16 }}>文档知识分配目录</label>
						<div>
							<TreeSelect
								style={{ width: "220px" }}
								dropdownStyle={{ maxHeight: 400, overflow: "auto" }}
								placeholder='请选择文档知识分类'
								allowClear
								value={this.state.categoryFileValue}
								showCheckedStrategy='SHOW_PARENT'
								treeNodeFilterProp='title'
								onChange={this.onFileChangeCategory}
							>
								{this.renderTreeFile(categoryFileList)}
							</TreeSelect>
						</div>
					</div>
					<div style={{ margin: '10px 0px 0px 156px', fontSize: '14px', color: 'red' }}>
						{categoryFileList.length > 0 ? initData && initData.type !== 'classify' ? (
							categoryFileList[0].children && categoryFileList[0].children.length > 0 ? null : (
								<div>当前知识库还没有文档知识点的目录，请创建后引用。</div>
							)
						) : null : (
							<div>当前知识中心还没有知识库，请创建后引用。</div>
						)}
					</div>
				</div>
			</Modal>
		);
	}
};

export default ReferenceTemplate;
